<?php
/**
 * The main template file
 *
 * This is the most generic template file in a WordPress theme
 * and one of the two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * E.g., it puts together the home page when no home.php file exists.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package WordPress
 * @subpackage Twenty_Seventeen
 * @since 1.0
 * @version 1.0
 */

get_header("home"); ?>

<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/home.css" />
<script src="<?php echo get_template_directory_uri(); ?>/js/jquery-2.1.3.min.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/jquery_kv.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/home.js"></script>

<div class="wrap body body2">
	<div id="" class="content-area">
		<main id="main" class="site-main" role="main">

			<div id="slideshow">
			<?php
			$contentarr = array();
			$linkarr = array();
			query_posts('showposts=5 & cat=31');
			if ( have_posts() ) :

				/* Start the Loop */
				$idx = 0;
				while ( have_posts() ) : the_post();

					/*
					 * Include the Post-Format-specific template for the content.
					 * If you want to override this in a child theme, then include a file
					 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
					 */
				 	//$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'large');
					$content_first_image = get_content_first_image( $post->post_content );
					$contentarr[] = $post->post_excerpt;
					$linkarr[] = esc_url( get_permalink() );

					if ($idx == 0) {
						?>
							<img onclick='link("<?php echo $linkarr[0]; ?>");' src="<?php echo $content_first_image; ?>" style="opacity: 1; display: block;" oncontextmenu="return false;" onselectstart="return false" ondragstart="return false">

						<?php
					} else {
						?>
							<img onclick='link("<?php echo $linkarr[$idx]; ?>");' src="<?php echo $content_first_image; ?>" style="" oncontextmenu="return false;" onselectstart="return false" ondragstart="return false">
						<?php
					}
					$idx = $idx + 1;
				endwhile;

			endif;
			?>
			</div>
			<footer class="footer">
				<div class="wrapper">
					<ul class="desc-wrapper">
					<li class="active"><p class="desc"><?php echo $contentarr[0]; ?></p></li>
					<?php
						for($i=1; $i<count($contentarr); ++$i){ 
					?>
							<li><p class="desc"><?php echo $contentarr[$i]; ?></p></li>
					<?php
						} 
					?>
					</ul>
					<ul class="page">
						<li class="active"></li>
						<?php
							for ($i=1; $i<count($contentarr); $i++) {
						?>
								<li class=""></li>
						<?php
							}
						?>
					</ul>
					<div class="more-wrapper">
						<ul class="more-list">
							<li class="active">
								<div class="more" data-id="<?php echo $linkarr[0]; ?>">
									<span>了解更多</span>
									<i></i>
								</div>
							</li>
							<?php
							for($i=1; $i<count($contentarr); ++$i){
							?>
								<li class="">
									<div class="more" data-id="<?php echo $linkarr[$i] ?>">
										<span>了解更多</span>
										<i></i>
									</div>
								</li>
							<?php
								}
							?>
						</ul>
					</div>
				</div>
			</footer>

		</main><!-- #main -->
	</div><!-- #primary -->
</div><!-- .wrap -->

<?php get_footer();
